<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Poll</title>
    <script type="text/javascript" src="/js/echarts.min.js"></script>
    <script type="text/javascript" src="/js/jquery-3.2.1.min.js"></script>
</head>
<body>
<div id="main" style="width: auto;height: 800px">

</div>

<script>
    $(function () {
        var chartDom = document.getElementById('main');
        var myChart = echarts.init(chartDom);
        var option;

        $.getJSON("/poll/findPoll",function (values){
            var xdata = []

            for(var i=0;i<values.length;i++){
                var json = {}
                json["name"]=values[i]['type']
                json["value"] = values[i]['average']
                xdata.push(json)
            }



            var option
            option = {
                title: {
                    text: '空气污染类型占比',
                    // subtext: 'Fake Data',
                    left: 'center'
                },
                tooltip: {
                    trigger: 'item'
                },
                legend: {
                    orient: 'vertical',
                    left: 'left'
                },
                series: [
                    {
                        name: '饼状图',
                        type: 'pie',
                        radius: '50%',
                        data: xdata,
                        emphasis: {
                            itemStyle: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        }
                    }
                ]
            };
            option && myChart.setOption(option);
        })
    })
</script>
</body>
</html>
